// pages/search/index.js
/**
 * 输入input搜索对应商品功能
 * 绑定input事件
 * 输入关键词
 * 判断关键词是否合法
 * 拿到关键词发送请求 携带关键词query
 * 拿到数据存在data中 渲染到页面上
 *
 * 防抖功能
 * 在用户输入内容开始搜索时
 * 会按下一次按键发送一次请求性能太低
 * 解决办法定时器 首先定义一个timeId 值为 什么都可以
 */

import { request } from "../../request/index";
import regeneratorRuntime from "../../lib/runtime/runtime";
Page({
  /**
   * 页面的初始数据
   */
  data: {
    goods: [],
    isFouse: false,
    inputValue: ""
  },
  timeId: -1,
  //触发input事件
  hanldeInput(e) {
    //拿到输入的值
    let { value } = e.detail;
    //判断输入的值是否合法
    if (!value.trim()) {
      this.setData({
        isFouse: false,
        goods: ""
      });
      return;
    }
    this.setData({
      isFouse: true
    });
    //清除定时器
    clearTimeout(this.timeId);
    //定时器 1秒后发送请求
    this.timeId = setTimeout(() => {
      //判断通过加载数据
      this.qsearch(value);
    }, 1000);
  },
  async qsearch(query) {
    let goods = await request({ url: "/goods/qsearch", data: { query } });
    this.setData({
      goods
    });
  },
  //点击取消按钮
  abandon() {
    this.setData({
      inputValue: "",
      isFouse: false,
      goods: ""
    });
  }
});
